<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
    />
    <title>苏宁易购首页</title>
    <!-- 引入初始化css -->
    <link rel="stylesheet" href="./css/normalize.css" />
    <link rel="stylesheet" href="./css/base.css" />
    <!-- 引入首页css -->
    <link rel="stylesheet" href="./css/index.css" />
    <!-- 引入字体图标 -->
    <link rel="shortcut icon" href="./favicon.ico" />
    <!-- 引入js -->
    <script src="./js/flexible.js"></script>
  </head>

  <body>
    <!-- top s -->
    <div class="top">
      <!-- 左侧分类图标 -->
      <div class="classfiy"><img src="./img/01.png" alt="" /></div>
      <!-- 中间广告区域 -->
      <div class="top_ad">
        <a href="javascript:;"><img src="./img/add.gif" alt="" /></a>
      </div>
      <!-- 右侧登录按钮 -->
      <div class="login"><img src="./img/02.png" alt="" /></div>
    </div>
    <!-- top e   -->

    <!-- search s  div版 -->
    <div class="search">
      <div class="sou"><p>双十一预定 定金十倍翻</p></div>
    </div>
    <!-- search e -->

    <!--  banner s-->
    <div class="banner">
      <img src="./upload/99.jpg" alt="" />
    </div>
    <!--  banner e-->

    <!-- ad1  s -->
    <div class="ad1">
      <a href="javascript:;"><img src="./upload/pic1.jpg" alt="" /></a>
    </div>
    <!-- ad1  e -->

    <!-- ad2  s -->
    <div class="ad2">
      <a href="javascript:;"><img src="./upload/pic2.jpg" alt="" /></a>
      <a href="javascript:;"><img src="./upload/pic3.jpg" alt="" /></a>
      <a href="javascript:;"><img src="./upload/pic4.jpg" alt="" /></a>
    </div>
    <!-- ad2  e -->

    <!-- nav s -->
    <div class="nav">
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/05.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/06.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/07.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/08.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/09.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/05.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/06.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/07.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/08.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
      <a href="javascript:;">
        <div class="nav_icon"><img src="./upload/09.png" alt="" /></div>
        <p>苏宁秒杀</p>
      </a>
    </div>
    <!-- nav e -->

    <!-- new s -->
    <div class="new">
      <a href="javascript:;"><img src="./upload/ad1.png" alt="" /></a>
      <a href="javascript:;"><img src="./upload/ad2.gif" alt="" /></a>
      <a href="javascript:;"><img src="./upload/ad3.gif" alt="" /></a>
    </div>
    <!-- new e -->

    <!-- miaosha s -->
    <div class="miaosha">
      <div class="items">
        <div class="tit">
          限时秒杀
          <div class="sk">
            <span>01</span>
            <span>:</span>
            <span>40</span>
            <span>:</span>
            <span>08</span>
          </div>
        </div>
        <p class="desc">人气好货限时抢</p>
        <ul>
          <li>
            <img src="./upload/nva_11.jpg" alt="" />
            <p>$9.9元</p>
          </li>
          <li>
            <img src="./upload/yangshengcha.jpg" alt="" />
            <p>$9.9元</p>
          </li>
        </ul>
      </div>
      <div class="items">
        <div class="tit">限时秒杀</div>
        <p class="desc">人气好货限时抢</p>
        <ul>
          <li>
            <img src="./upload/shuihu.webp" alt="" />
            <p>$9.9元</p>
          </li>
          <li>
            <img src="./upload/xiaomi.webp" alt="" />
            <p>$9.9元</p>
          </li>
        </ul>
      </div>
      <div class="items">
        <div class="tit">限时秒杀</div>
        <p class="desc">人气好货限时抢</p>
        <ul>
          <li>
            <img src="./upload/miaosha_1.jpg" alt="" />
            <p>$9.9元</p>
          </li>
          <li>
            <img src="./upload/miaosha_2.webp" alt="" />
            <p>$9.9元</p>
          </li>
        </ul>
      </div>
      <div class="items">
        <div class="tit">限时秒杀</div>
        <p class="desc">人气好货限时抢</p>
        <ul>
          <li>
            <img src="./upload/miaosha_3.webp" alt="" />
            <p>$9.9元</p>
          </li>
          <li>
            <img src="./upload/miaosha_4.webp" alt="" />
            <p>$9.9元</p>
          </li>
        </ul>
      </div>
    </div>
    <!-- miaosha e -->

    <!-- rec s -->
    <div class="rec">
      <div class="rec_l">
        <h3>为您推荐</h3>
        <p>精选频道</p>
      </div>
      <div class="links">
        <a href="javascript:;">
          <img src="./upload/mt.png" alt="" />
          <p>会员抢购</p>
        </a>
        <a href="javascript:;">
          <img src="./upload/mt.png" alt="" />
          <p>会员抢购</p>
        </a>
        <a href="javascript:;">
          <img src="./upload/mt.png" alt="" />
          <p>会员抢购</p>
        </a>
        <a href="javascript:;">
          <img src="./upload/mt.png" alt="" />
          <p>会员抢购</p>
        </a>
      </div>
    </div>
    <!-- rec e -->

    <!-- rec_list s -->
    <div class="rec_list">
      <!-- rec_hd -->
      <div class="rec_hd">推荐榜单</div>
      <ul>
        <li>
          <a href="javascript:;">
            <!-- rec_bd -->
            <div class="rec_bd">
              <div class="rec_pic"><img src="./upload/sj.webp" alt="" /></div>
              <div class="rec_bg"><img src="./upload/11.png" alt="" /></div>
              <span>人气榜</span>
              <p class="s_tit">空调榜</p>
            </div>
          </a>
        </li>
        <li>
          <a href="javascript:;">
            <!-- rec_bd -->
            <div class="rec_bd">
              <div class="rec_pic"><img src="./upload/sj.webp" alt="" /></div>
              <div class="rec_bg"><img src="./upload/12.png" alt="" /></div>
              <span>人气榜</span>
              <p class="s_tit">空调榜</p>
            </div>
          </a>
        </li>
        <li>
          <a href="javascript:;">
            <!-- rec_bd -->
            <div class="rec_bd">
              <div class="rec_pic"><img src="./upload/sj.webp" alt="" /></div>
              <div class="rec_bg"><img src="./upload/11.png" alt="" /></div>
              <span>人气榜</span>
              <p class="s_tit">空调榜</p>
            </div>
          </a>
        </li>
      </ul>
    </div>
    <!-- rec_list e -->

    <!-- like s -->
    <!-- cai_tit s -->
    <div class="cai_tit"><img src="./upload/cainixihuan.webp" alt="" /></div>
    <!-- cai_tit e -->
    <div class="like">
      <ul>
        <li>
          <div class="pic"><img src="./upload/shouji.jpg" alt="" /></div>
          <div class="txt">
            <h3>
              OPPO K7 8GB+128GB 海夜 高通骁龙765G 一体化双模5G 30W VOOC闪充
              4800万超清四摄 全网通全面屏拍照游戏智能手机
            </h3>
            <!-- tag -->
            <div class="tag">
              <img src="./upload/ziying.png" alt="" />
              <span>快来买</span>
              <span>快买</span>
            </div>
            <p>$1899</p>
          </div>
        </li>
        <li>
          <div class="pic"><img src="./upload/yibao.webp" alt="" /></div>
          <div class="txt">
            <h3>
              OPPO K7 8GB+128GB 海夜 高通骁龙765G 一体化双模5G 30W VOOC闪充
              4800万超清四摄 全网通全面屏拍照游戏智能手机
            </h3>
            <!-- tag -->
            <div class="tag">
              <img src="./upload/ziying.png" alt="" />
              <span>快来买</span>
              <span>快买</span>
            </div>
            <p>$1899</p>
          </div>
        </li>
        <li>
          <div class="pic"><img src="./upload/kele.webp" alt="" /></div>
          <div class="txt">
            <h3>
              OPPO K7 8GB+128GB 海夜 高通骁龙765G 一体化双模5G 30W VOOC闪充
              4800万超清四摄 全网通全面屏拍照游戏智能手机
            </h3>
            <!-- tag -->
            <div class="tag">
              <img src="./upload/ziying.png" alt="" />
              <span>快来买</span>
              <span>快买</span>
            </div>
            <p>$1899</p>
          </div>
        </li>
        <li>
          <div class="pic"><img src="./upload/huafei.webp" alt="" /></div>
          <div class="txt">
            <h3>
              OPPO K7 8GB+128GB 海夜 高通骁龙765G 一体化双模5G 30W VOOC闪充
              4800万超清四摄 全网通全面屏拍照游戏智能手机
            </h3>
            <!-- tag -->
            <div class="tag">
              <img src="./upload/ziying.png" alt="" />
              <span>快来买</span>
              <span>快买</span>
            </div>
            <p>$1899</p>
          </div>
        </li>
      </ul>
    </div>
    <!-- like e -->

    <!-- go_login s -->
    <div class="go_login">
      <img src="./upload/denglu.png" alt="" />
    </div>
    <!-- go_login e -->

    <!-- snlogo s -->
    <div class="snlogo">
      <img src="./upload/snlogo.png" alt="" />
    </div>
    <!-- snlogo e -->

    <!-- footer s -->
    <div class="footer">
      <a href="javascript:;"
        ><div class="ico"><img src="./img/001.png" alt="" /></div>
        <p class="cur">首页</p></a
      >
      <a href="javascript:;"
        ><div class="ico"><img src="./img/002.png" alt="" /></div>
        <p>分类</p></a
      >
      <a href="javascript:;"
        ><div class="ico"><img src="./img/003.png" alt="" /></div>
        <p>排行榜</p></a
      >
      <a href="javascript:;"
        ><div class="ico"><img src="./img/004.png" alt="" /></div>
        <p>购物车</p></a
      >
      <a href="javascript:;"
        ><div class="ico"><img src="./img/005.png" alt="" /></div>
        <p>我的易购</p></a
      >
    </div>
    <!-- footer e -->
  </body>
</html>
